<span class="pull-right">
    <span id="favorites-count">{{ article_favorite_count }}</span>人收藏此文章{% if user.is_authenticated %},
    <a href="javascript:void(0);" id="unfavorite"{% if not self_has_favorited %}style="display:none;"{% endif %}>取消收藏</a>
    <a href="javascript:void(0);" id="favorite"{% if self_has_favorited %}style="display:none;"{% endif %}>我要收藏</a>{% endif %}
</span>
<script>
    $("#favorite").click(function() {
        var csrftoken = getCookie('csrftoken');
        $.ajax({
            type: "POST",
            url: "{% url 'translations:favorites:create' article.id %}",
            dataType: "json",
            data: {csrfmiddlewaretoken: csrftoken },
            success: function(data) {
                $("#favorite").hide();
                $("#unfavorite").show();
                $("#favorites-count").text(data);
            }
        });
    });
    $("#unfavorite").click(function(){
        var csrftoken = getCookie('csrftoken');
        $.ajax({
            type: "POST",
            url: "{% url 'translations:favorites:delete' article.id %}",
            dataType: "json",
            data: {csrfmiddlewaretoken: csrftoken },
            success: function(data) {
                $('#favorite').show();
                $("#unfavorite").hide();
                $("#favorites-count").text(data);
            }
        });
    });
</script>